<template>
  <div class="table-box">
    <Table ref="tableRef" row-key="token" :columns="columns" :request-api="onlineApi.list" :pagination="false">
      <!-- 菜单操作 -->
      <template #action="{ row, id }">
        <TableAction :actions="getActions(row, id)" :show-num="0"></TableAction>
      </template>
    </Table>
  </div>
</template>

<script setup lang="tsx" name="SysUserOnline">
import { ref } from "vue";
import { Table, TableAction, useTable } from "@/components/Table";
import { ActionItem } from "@/components/Table/type";
import onlineApi from "./api";
import { columns } from "./data";
const tableRef = ref();
const { getTableList } = useTable(tableRef);
const getActions = (row, id): Partial<ActionItem[]> => {
  return [
    {
      type: "danger",
      auth: "system:user-online:kick",
      popConfirm: {
        title: "是否确定强退？",
        onConfirm: async () => {
          await onlineApi.kick(id);
          await getTableList();
        }
      },
      icon: "delete"
    }
  ];
};
</script>
